<template>
  <div>
    <Spin :spinning="loading" tip="Loading...">
      <div style="padding-top: 1rem;"></div>
    <!-- table -->
    <FormPanel ref="formPanel" :list="formList" :cols="2" :formType="'add'" labelWidth="110" :isSubmitBtn="false" @formChange="formChangeHandle" />
    <div style="padding-top: 1rem;"></div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <multiuse-button type="primary" :click="saveDialog.bind()">保 存</multiuse-button>
      <multiuse-button @click="closeDialog">关 闭</multiuse-button>
    </div>
    </Spin>
      <BaseDialog :visible.sync="zhusunjian" :title="'主损件选择'" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
        <Selectzhusunjian @close="zhusunjianClose" @save="zhusunjianSave"></Selectzhusunjian>
      </BaseDialog>
      <BaseDialog :visible.sync="guzhangxianxiangdaima" :title="'故障现象选择'" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
        <Selectguzhangxianxiang @close="guzhangxianxiangdaimanClose" @save="guzhangxianxiangdaimaSave"></Selectguzhangxianxiang>
      </BaseDialog>
  </div>
</template>
<script>
import { editSave ,getTjdetail} from '@/api/claim/factory/PartAndFault';
import Selectzhusunjian from '@/pages/claimDemage/tools/vehicle.vue';
import Selectguzhangxianxiang from './Selectguzhangxianxiang.vue';
import { copyUpdateData } from '@/utils/index';
export default {
  props: ['type', 'rowData'],
  components: {
    Selectzhusunjian,
    Selectguzhangxianxiang
  },
  data() {
    return {
      loading: false,
      visible: false,
      visibleDrawer: false,
      visibleAdd: false,
      zhusunjian: false,
      guzhangxianxiangdaima: false,
      flterValue: {}, //参数
      fetchParams: {}, //ipa 接口
      formList: this.createFormList(),
      saveData: null,
      val: null,
      newVar:{}
    };
  },
  created() {
  },
  mounted() {
    this.getDetailFun(this.rowData.fapaId);
  },
  methods: {
    selectfaultCode() {
      this.guzhangxianxiangdaima = true;
    },
    //故障现象
    guzhangxianxiangdaimanClose() {
      this.guzhangxianxiangdaima = false;
    },
    guzhangxianxiangdaimaSave(obj) {
      this.formList.map(x =>{
        if ('faultCode' == x.fieldName) {
            x.initialValue = obj[0].faultCode; 
        }
        if ('faultName' == x.fieldName) {
            x.initialValue = obj[0].faultName; 
        }
        if ('sysCode1' == x.fieldName) {
            x.initialValue = obj[0].sysCode1; 
        }
        if ('sysName1' == x.fieldName) {
            x.initialValue = obj[0].sysName1; 
        }
        if ('sysCode2' == x.fieldName) {
            x.initialValue = obj[0].sysCode2; 
        }
        if ('sysName2' == x.fieldName) {
            x.initialValue = obj[0].sysName2; 
        }
        if ('sysCode3' == x.fieldName) {
            x.initialValue = obj[0].sysCode3; 
        }
        if ('sysName3' == x.fieldName) {
            x.initialValue = obj[0].sysName3; 
        }
        if ('sysCode4' == x.fieldName) {
            x.initialValue = obj[0].sysCode4; 
        }
        if ('sysName4' == x.fieldName) {
            x.initialValue = obj[0].sysName4; 
        }
      } );
      this.guzhangxianxiangdaima = false;
    },
    //主损件
    zhusunjianClose() {
      this.zhusunjian = false;
    },
    zhusunjianSave(obj) {
        this.partId = obj[0].partId;
        this.formList.map(x => {
          if ('partCode' == x.fieldName) {
            x.initialValue = obj[0].partCode; //主损件返显
          }
          if ('partName' == x.fieldName) {
            x.initialValue = obj[0].partName; //主损件返显
          }

        });

        this.zhusunjian = false;
       // this.fetchParams = { ...this.fetchParams };
    },
    selectpartCode() {
        this.zhusunjian = true;
    },
    async getDetailFun(id) {
      this.loading = true;
      let res = (await getTjdetail({ id: id })).data;
      this.newVar = res;
      for (let i in res) {
        this.formList.map(x => {
          if (x.fieldName == i) {
            x.initialValue = res[i];
          }
        });
      }

      console.log(res, 'res');
      this.loading = false;
    },
    formChangeHandle(val) {
      console.log(val);
      this.saveData = val;
    },
    async saveDialog() {
      this.$refs.formPanel.SUBMIT_FORM();
      if (this.saveData !== null) {
         console.log(this.saveData);
        this.newVar = copyUpdateData(this.newVar,this.saveData);
        this.saveData.ownerCode = this.rowData.ownerCode;
        this.saveData.ownerParCode = this.rowData.ownerParCode;
        this.saveData.appId = this.rowData.appId;
        this.saveData.fapaId = this.rowData.fapaId;
        // this.saveData.partCode = this.rowData.partCode;
        // console.log(this.saveData.partCode,"this.saveData.partCode");
        // this.saveData.partName = this.rowData.partName;
        //this.saveData.faultId=this.rowData.faultId;
        this.saveData.faultCode=this.rowData.faultCode;
        this.saveData.isDeleted=this.rowData.isDeleted;
        //this.saveData.createdBy=this.rowData.createdBy;
        //this.saveData.createdAt=this.rowData.createdAt;
         this.saveData.isDeleted=this.rowData.isDeleted;
        this.loading = true;
        let res = await editSave(this.newVar);
        console.log(res);
        if (res.resultCode === 200) {
          this.$emit('save');
          return this.$notify.success({ title: '提示信息', message: '保存成功' });
        } else {
          this.loading = false;
        }
      }
    },
    //保存
    chooseOrderNo() {
      this.visibleDrawer = true;
    },
    closeAdd() {
      this.visibleDrawer = false;
      this.fetchParams = { ...this.fetchParams };
    },
    saveAdd() {
      this.visibleDrawer = false;
      this.fetchParams = { ...this.fetchParams };
    },
    //取消操作
    closeDialog() {
      this.$emit('close', { visible: false, data: this.selectedRows, type: 'close' });
    },
    createFormList() {
      return [
        {
          type: 'INPUT',
          label: '主损件代码',
          fieldName: 'partCode',
          placeholder: '请输入主损件代码...',
          initialValue: '',
          rules: [{required: true, message: '请输入主损件代码...', trigger: 'change'}],
            unitRender: p => {
              return (
                <div>
                <multiuse-button icon="el-icon-search" onClick={() => this.selectpartCode()} />
              </div>
            );
            }
        },
        {
          type: 'INPUT',
          label: '主损件名称',
          fieldName: 'partName',
          placeholder: '请输入主损件名称...',
          initialValue: '',
          disabled: true, // 置灰
          rules: [{required: true, message: '请输入主损件名称...', trigger: 'change'}]
        },
        {
          type: 'INPUT',
          label: '故障现象代码',
          fieldName: 'faultCode',
          rules: [{ required: true, message: '请选择故障现象代码', trigger: 'blur' }],
          unitRender: p => {
            return (
              <div>
                <multiuse-button icon="el-icon-search" onClick={() => this.selectfaultCode()} />
              </div>
            );
          }
        },
        {
          type: 'INPUT',
          label: '故障现象描述',
          fieldName: 'faultName',
          placeholder: '请输入...',
          initialValue: undefined,
          readonly:true,
          disabled: true,
          rules: [{ required: true, message: '请输入故障现象描述', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '一级代码',
          fieldName: 'sysCode1',
          placeholder: '请输入一级...',
          initialValue: '',
          readonly:true,
          disabled: true, // 置灰
          rules: [{required: true, message: '请输入一级...', trigger: 'change'}]
        },
        {
          type: 'INPUT',
          label: '一级名称',
          fieldName: 'sysName1',
          placeholder: '请输入一级名称...',
          initialValue: '',
          readonly:true,
          disabled: true, // 置灰
          rules: [{required: true, message: '请输入一级名称...', trigger: 'change'}]
        },
        {
          type: 'INPUT',
          label: '二级代码',
          fieldName: 'sysCode2',
          placeholder: '请输入二级...',
          initialValue: '',
          readonly:true,
          disabled: true, // 置灰
          rules: [{required: true, message: '请输入二级...', trigger: 'change'}]
        },
        {
          type: 'INPUT',
          label: '二级名称',
          fieldName: 'sysName2',
          placeholder: '请输入二级名称...',
          initialValue: '',
          readonly:true,
          disabled: true, // 置灰
          rules: [{required: true, message: '请输入二级名称...', trigger: 'change'}]
        },
        {
          type: 'INPUT',
          label: '三级代码',
          fieldName: 'sysCode3',
          placeholder: '请输入三级...',
          initialValue: '',
          readonly:true,
          disabled: true, // 置灰
          rules: [{required: true, message: '请输入三级...', trigger: 'change'}]
        },
        {
          type: 'INPUT',
          label: '三级名称',
          fieldName: 'sysName3',
          placeholder: '请输入三级名称...',
          initialValue: '',
          readonly:true,
          disabled: true, // 置灰
          rules: [{required: true, message: '请输入三级名称...', trigger: 'change'}]
        },
        {
          type: 'INPUT',
          label: '故障代码',
          fieldName: 'sysCode4',
          placeholder: '请输入故障代码...',
          initialValue: '',
          readonly:true,
          disabled: true, // 置灰
          rules: [{required: true, message: '请输入故障代码...', trigger: 'change'}]
        },
        {
          type: 'INPUT',
          label: '故障名称',
          fieldName: 'sysName4',
          placeholder: '请输入故障名称...',
          initialValue: '',
          readonly:true,
          disabled: true, // 置灰
          rules: [{required: true, message: '请输入故障名称...', trigger: 'change'}]
        },
        {
          type: 'SELECT',
          label: '状态',
          placeholder: '请选择状态...',
          filterable: true,
          fieldName: 'faStatus',
          itemList: [{text: '禁用', value: 0}, {text: '启用', value: 1}],
          rules: [{required: true, message: '请选择状态...', trigger: 'change'}]
        }
      ];
    }
  }
};
</script>

<style lang="less" scoped></style>
